<template>
  <ex-dialog
    width="600px"
    class="ex-diolog"
    title="修改邀请人"
    :visible="visible"
    center="true"
    @closeDialog="handleClose"
  >	
		<el-form  :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm ">
			<el-form-item prop="referrer">
				<el-input v-model="ruleForm.referrer" placeholder="请输入" maxlength="10"></el-input>
			</el-form-item>
			<el-form-item>
				<el-button @click="handleClose('ruleForm')">取消</el-button>
        <el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
			</el-form-item>
		</el-form>
  </ex-dialog>
</template>
<script>
// components
import Loading from '@/components/Loading/index'
// api
import {editReferrer} from "@/api/merchants";

// api
export default {
  components: {
    Loading
  },
  props: {
    visible: Boolean,
    id: String,
    referrer: String,
  },
  data() {
    return {
			ruleForm: {
				referrer: '',//推荐人
			},
			rules: {
          referrer: [
            { required: true,message: '请输入推荐人', trigger: 'blur' }
          ],
          
        }
    }
  },
  computed: {
   
  },
  created() {
    this.ruleForm.referrer = this.referrer
	},
  methods: {
    usedInPar(str){
      console.log(str);

    },
    //新建会员
    submitForm(formName) {
      console.log('formName',formName)
      this.$refs[formName].validate((valid) => {
        console.log('valid',valid)
        if (valid) {
          var data = {
            id: this.id,
            referrer:this.ruleForm.referrer
          }
          editReferrer(data).then(res => {
            this.handleSuccess("增加成功")
          }).finally(() => {
            this.loading = false
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    
    
    
		//取消
    handleClose(formName) {
      this.$emit('update:visible', false)
			// this.$refs[formName].resetFields();
    },
		//确认
	
    handleSuccess(msg) {
      if (msg === '已拒绝') {
        var type = 'error'
      } else {
        var type = 'success'
      }
      this.$message({
        message: msg,
        type: type,
        duration: 1500,
        onClose: () => {
          this.handleClose()
          this.$emit('success')
        }
      })
    },
  }
}
</script>
<style lang="scss" scoped>
.ex-diolog {
  ::v-deep .ex--dialog--footer {
    border: none !important;
		padding: 0 !important;
  }
	::v-deep .ex--dialog--main {
    padding: 10px 20px !important;
  }
  
}
.el-input{
    width: 310px !important; 
  }
</style>
